<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<link rel="icon" href="data:;base64,=">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>WiFi 配置</title>
	</head>
	<body>
		<div>
			<center>
				<div id="head">
					<h1>WiFi 配置页面</h1>
				</div>
				<div>
					<label>WiFi 名称</label>
					<input id="wifiname" value="417" /><br /><br />
					<label>WiFi 密码</label>
					<input id="wifipass" value="417417417417" /><br /><br />
					<label>串口波特率：</label>
					<select id="bps">
						<option value="300">300 </option>
						<option value="600">600 </option>
						<option value="1200">1200 </option>
						<option value="2400">2400 </option>
						<option value="4800">4800 </option>
						<option value="9600" selected="true">9600 </option>
						<option value="19200">19200 </option>
						<option value="38400">38400 </option>
						<option value="56000">56000 </option>
						<option value="115200">115200</option>
					</select>
					<br /><br />
					<label>服务器IP</label>
					<input id="ip" value="106.12.184.169" /><br /><br />
					<label>服务器端口</label>
					<input id="port" value="2021" /><br /><br />
					<label>用户名称</label>
					<input id="username" value="ABC856" /><br /><br />
					<label>用户密码</label>
					<input id="userpass" value="ABC856" /><br /><br />
					<label>设备ID</label>
					<input id="id" value="ABC856" /><br /><br />
					<label>订阅主题</label>
					<input id="sub" value="ABC856" /><br /><br />
					<label>发布主题</label>
					<input id="pub" value="ABC856" /><br /><br />
					<script>
						var random_id = "ABC" + String(Math.ceil(Math.random() * 1000));
						var random_sub = "D" + random_id;
						var random_pub = "U" + random_id;
						document.getElementById('id').value = random_id;
						document.getElementById('sub').value = random_sub;
						document.getElementById('pub').value = random_pub;
					</script>
				</div>
				<div>
					<br /><br />
					<button id="submit" onclick="submit_data()">确定</button>
					<script>
						function submit_data() {
							var info = "";
							var dat;

							dat = document.getElementById('wifiname').value;
							info = "a1=" + String(dat);

							dat = document.getElementById('wifipass').value;
							info = info + "&a2=" + String(dat);

							dat = document.getElementById('bps').value;
							info = info + "&a3=" + String(dat);

							dat = document.getElementById('ip').value;
							info = info + "&a4=" + String(dat);

							dat = document.getElementById('port').value;
							info = info + "&a5=" + String(dat);

							dat = document.getElementById('username').value;
							info = info + "&a6=" + String(dat);

							dat = document.getElementById('userpass').value;
							info = info + "&a7=" + String(dat);

							dat = document.getElementById('id').value;
							info = info + "&a8=" + String(dat);

							dat = document.getElementById('sub').value;
							info = info + "&a9=" + String(dat);

							dat = document.getElementById('pub').value;
							info = info + "&a10=" + String(dat);

							http_post("www.8266.com",info);

							console.log(info);

							return 0;
						}
					</script>
					<script>
						function http_post(url, info) {
							var xml = new XMLHttpRequest();
							xml.open("POST", url, true);
							xml.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
							xml.onreadystatechange = function() {
								if (xml.readyState == 4 && xml.status == 200) {
									var back = xml.responseText;
									console.log("\n\n[respond]\n\n" + back);
									return 0;
								}
							}
							xml.send(info);
							console.log("[POST] " + String(info));
						}
					</script>
				</div>
			</center>
		</div>

	</body>
</html>
